<template>
  <div style="position: relative;width: 162px;">
    <el-input
      v-model="info_mat_no"
      type="input"
      placeholder="请输入内容"
      class="xw_inputPreNext"
      style="width: 174px;position: absolute;top: 3px;">
      <!--@keyup.enter.native="search"
      -->>
      <template slot="prepend">
        <div class="xw_divBtn">
          <el-button
            type="primary"
            @click="preNext(1)"><i class="el-icon-caret-left"/> </el-button>
        </div>
      </template>
      <template slot="append">
        <div class="xw_divBtn">
          <el-button
            type="primary"
            @click="preNext(-1)"><i class="el-icon-caret-right"/> </el-button>
        </div>
      </template>
    </el-input>
  </div>
</template>

<script>
import { getDB } from '@/lib/GetDB'
export default {
  name: 'Coil',
  props: {
    matNo: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      info_mat_no: '',
      countType: 0,
      matNoAll: [],
      matNoLine: {}
    }
  },
  watch: {
    matNo: {
      handler(newVal, oldVal) {
        // this.search(this.matNo)
        this.info_mat_no = this.matNo
      },
      deep: true,
      immediate: true
    }
  },
  mounted() {
    this.getNewMatNo(true)
  },
  methods: {
    // 获取卷号
    getMatNo() {
      return this.info_mat_no
    },
    search(params) {
      // 搜索条件改变时
      console.log('查询条件', params)
      // this.$emit('search', this.matNo)
    },
    async getNewMatNo(flag) {
      let postData = {}
      const p = {
        curPage: 0,
        pageSize: 30
      }
      p.time1 = '1999-01-01 00:00:00'
      p.time2 = '3999-01-01 00:00:00'
      postData = {
        module: 'DbService',
        method: 'DbService',
        request: {
          server: 'db1',
          key: 'selectMatNo_cal',
          params: [p]
        },
        record: false
      }
      getDB(
        postData,
        data => {
          if (data.code === 200) {
            this.matNoAll = data.results[0]
            this.countType = 0
            if (this.info_mat_no === '') {
              this.info_mat_no = this.matNoAll[this.countType].mat_no
            }
            if (flag) {
              this.$emit('search', this.info_mat_no)
            }
          }
        },
        error => {
          console.log(error)
        }
      )
    },
    // 查询上一卷下一卷
    async preNext(type) {
      this.countType += type
      if (this.countType < 0) {
        this.getNewMatNo(false)
      } else {
        this.info_mat_no = this.matNoAll[this.countType].mat_no
      }
    }
  }
}
</script>

<style scoped>
/deep/.el-input-group__append {
  padding: 0px;
}
/deep/.el-input-group__prepend {
  padding: 0px;
}
/deep/.el-input__inner {
  padding: 2px 0px !important;
}
</style>
<style>
.xw_inputPreNext .xw_divBtn {
  width: 21px;
}
</style>
